<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>店铺</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <link href="themes/css/store.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="themes/js/jquery.min.js"></script>
    <script type="text/javascript" src="themes/js/tab.js"></script>

</head>
<body>

<section class="aui-flexView" id="content">
    <header class="aui-navBar aui-navBar-fixed b-line">
        <a href="javascript:history.back(-1)" class="aui-navBar-item">
            <i class="icon icon-return"></i>
        </a>
        <div class="aui-center">
            <span class="aui-center-title" v-text="business.businessName"></span>
        </div>
        <a href="javascript:;" class="aui-navBar-item">
            <i class="icon icon-share"></i>
        </a>
    </header>
    <section class="aui-scrollView">
        <div class="aui-head-bg">
            <div class="aui-shop-logo">
                <img :src="business.businessImg" alt="">
            </div>
        </div>
        <div class="aui-head-tile b-line">
            <h2 v-text="business.businessName"></h2>
            <h3>130033人关注</h3>
            <button>+关注</button>
        </div>


        <div class="aui-tab" data-ydui-tab>
            <ul class="tab-nav b-line">
                <li class="tab-nav-item tab-active">
                    <a href="javascript:">
                        <span>全部</span>
                    </a>
                </li>
                <li class="tab-nav-item">
                    <a href="javascript:">
                        <span>好价</span>
                    </a>
                </li>
                <li class="tab-nav-item">
                    <a href="javascript:">
                        <span>好物社区</span>
                    </a>
                </li>
            </ul>
            <div class="tab-panel">
                <div class="tab-panel-item tab-active">
                    <a href="javascript:;" class="aui-flex" v-for="pro in products" @click="skipProduct(pro.productId)">
                        <div class="aui-shop-img">
                            <img :src="pro.productImg" alt="">
                        </div>
                        <div class="aui-flex-box">
                            <h2 v-text="pro.productName"></h2>
                            <h5 v-text="pro.productDesc"></h5>
                            <span>
                                        <em>白菜价</em>
                                        <em>拼单</em>
                                    </span>
                            <h3 v-text="pro.productPrice"></h3>
                            <p><span v-text="business.businessName"></span> | 14:38</p>
                        </div>
                        <div class="aui-flex aui-flex-pic">
                            <div class="aui-flex-box">
                                <span><i class="icon icon-user"></i>0</span>
                            </div>
                            <div class="aui-list-right">
                                <span><i class="icon icon-coin"></i>0</span>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="tab-panel-item">

                </div>
            </div>
        </div>
    </section>
</section>
<script src="themes/js/jquery.min.js"></script>
<script src="themes/js/vue.js"></script>
<script>
    var vue = new Vue({
        el: "#content",
        data: {
            business: {},
            products: []
        },
        created: function () {
            this.init();
        },
        methods: {
            init: function () {
                var businessId = window.location.search.substr(1).split("=")[1];
                console.log(businessId);
                var _this = this;
                //根据商家id获取商家详情
                $.ajax({
                    url: "/ShoppingMallHome/selectBusinessByBusinessId",
                    type: "get",
                    data: {businessId: businessId},
                    dataType: "json",
                    success: function (da) {
                        _this.business = da.obj;
                        console.log(_this.business);
                    }

                });
                //根据商家id获取所有商品详情
                $.ajax({
                    url: "/ShoppingMallHome/selectProductsByBusinessId",
                    type: "get",
                    data: {businessId: businessId},
                    dataType: "json",
                    success: function (da) {
                        _this.products = da.li;
                    }

                });
            },
            skipProduct:function(e){
                location.href="ui-product.html?productId="+e;
            }
        }

    });
</script>
</body>
</html>
